<template>
    <view class="service-child">
        <view class="search-result">
            <view style="text-align: center;background-color: #fff;padding:20rpx"><text>主单号- {{serviceNo}}</text>
            </view>
            <template v-if="childList.length >0">
                <view class="search-item" v-for="item in childList" :key="item.id">
                    <view style="display:flex;justify-content: space-between;align-items: center;">
                        <text>{{item.serialNumber}}</text>
                    </view>
                    <view class="search-item-info info-s">
                        <view>
                            <text class="search-item-info-title">产品类型:</text>
                            <text class="ml-10">{{item.typeName}}</text>
                        </view>
                        <view>
                            <text class="search-item-info-title">价格:</text>
                            <text class="ml-10"> {{item.price}}</text>
                        </view>
                    </view>

                    <view class="search-item-info ">
                        <view>
                            <text class="search-item-info-title">销售日期:</text>
                            <text class="ml-10">{{item.saleDate}}</text>
                        </view>
                    </view>

                    <view class="search-item-info">
                        <view>
                            <text class="search-item-info-title">有效期:</text>
                            <text class="ml-10">{{item.startTime}} - {{item.endTime}}</text>
                        </view>
                    </view>
                </view>
            </template>
            <template v-else>
                <u-empty mode="list" text="暂无数据" marginTop="120" />
            </template>
        </view>
    </view>
</template>

<script>
import { listService } from "@/utils/api";
import { base64Decode } from "@/utils";

export default {
    data() {
        return {
            serviceNo: "",
            childList: [],
        };
    },
    onLoad(e) {
        if (e.serviceNo) {
            this.serviceNo = e.serviceNo;
            this.getChildList();
        } else {
            uni.switchTab({ url: "/pages/index/index" });
        }
    },

    methods: {
        async getChildList() {
            try {
                let params = {
                    pageSize: 1,
                    pageNum: 1,
                    serviceNo: this.serviceNo,
                };
                let res = await listService({
                    params,
                    custom: { catch: true },
                });
                this.childList = res.rows[0].businessJson
                    ? JSON.parse(res.rows[0].businessJson)
                    : [];
            } catch (error) {}
        },
    },
};
</script>

<style lang="scss" scoped>
uni-page-body {
    width: 100%;
    height: 100%;
    background: #f4f4f4;
}
.search-result {
    background: #f4f4f4;
}

.search-item {
    background: #fff;
    margin-top: 20rpx;
    padding: 20rpx 28rpx;

    &-info {
        color: #666;
        font-size: 14px;
        display: flex;
        justify-content: space-between;
        margin-top: 12rpx;
        &:nth-of-type(1) {
            margin-top: 0;
        }
        &.info-s {
            > view:first-of-type {
                width: 60%;
            }
            > view:last-of-type {
                width: 40%;
            }
        }

        .ml-10 {
            margin-left: 10px;
        }

        &-title {
            display: inline-block;
        }
    }
}
</style>